<template>
	<view>
		<head-navbar :back="true">
			<view>
				<text>奖品列表</text>
			</view>
		</head-navbar>
		<view class="content" v-for='(item,index) in list'>
			<view class="date">{{item.createTime*1000 | formatTime("YMDHMS")}}</view>
			<text class="num">{{item.prizeName}}</text>
			<!-- <view class="num1">{{item.accountNo}}</view> -->
			<text class="num2">{{item.accountNo}}</text>
			<view class="pic">
				<image src="../../static/img/prizeList.png"></image>
			</view>
		</view>
		<u-loadmore color='#949494' :status="status" bg-color="rgba(255,255,255,0)" margin-top='20' margin-bottom='15'
		 @loadmore='laodmore' :loadText="loadText" />
	</view>
</template>

<script>
	import * as api from '../../api/group/index'
	export default {
		data() {
			return {
				list: [],
				childUserId: '',
				status: 'loading',
				loadText: {
					loadmore: '获取数据错误,点击重新加载',
					loading: '努力加载中',
					nomore: '没有更多了哦'
				},
			}
		},
		onLoad(option) {
			this.childUserId = option.childUserId
			this.getWinningLogByUser()
		},
		methods: {
			laodmore() {
				this.status = 'loading'
				this.list = []
				this.getWinningLogByUser()
			},
			getWinningLogByUser() {
				api.getWinningLogByUser({
					request: {
						winningUserId: this.childUserId
					}
				}).then(res => {
					this.status = 'nomore'
					this.list = res.data.dataBody
				}).catch(err => {
					this.status = 'loadmore'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 680rpx;
		height: 220rpx;
		background-color: #fff;
		border-radius: 30rpx;
		margin-left: 35rpx;
		margin-top: 24rpx;
		position: relative;

		.date {
			padding: 15rpx 0 14rpx 30rpx;
			font-size: 15rpx;
		}

		.num {
			padding-left: 26rpx;
			color: #2B2B2B;
			font-size: 48rpx;
			font-weight: 600;
		}

		.num1 {
			padding-left: 30rpx;
			font-size: 18rpx;
			color: #999999;
			margin-bottom: 15rpx;
		}

		.num2 {
			padding-left: 30rpx;
			font-size: 26rpx;
			color: #999999;
			display: block;
			margin-top: 20rpx;
		}

		.pic {
			position: absolute;
			right: 20rpx;
			top: 20rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;

			image {
				margin-top: 40rpx;
				width: 182rpx;
				height: 94rpx;
				align-items: center;
			}

			.yes {
				font-size: 30rpx;
				color: #FF5B02;
				font-weight: 500;
				text-align: center;
			}
		}
	}
</style>
